<style>
    .fieldlist dd ins {
        width: 27% !important;
    }
    .fieldlist dd input:first-child {
        width: 100% !important;
    }
    .form-inline .selectpicker{
        width: 100% !important;
        left: 0 !important;
    }
    </style>
<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Title')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-title" data-rule="required" class="form-control" name="row[title]" type="text" value="{$row.title|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Tpl_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-tpl_id" data-rule="required" class="form-control" name="row[tpl_id]" type="text" value="{$row.tpl_id|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Content')}:</label>
        <div class="col-xs-12 col-sm-8">
            <dl class="fieldlist" data-template="content-tpl" data-name="row[content]" data-tpl='{$template_data}'>
                <dd>
                    <ins>{:__('参数')}</ins>
                    <ins>{:__('值')}</ins>
                    <ins>{:__('默认值')}</ins>
                </dd>
                <dd><a href="javascript:;" class="btn btn-sm btn-success btn-append"><i class="fa fa-plus"></i> {:__('Append')}</a></dd>
                <!--请注意 dd和textarea间不能存在其它任何元素，实际开发中textarea应该添加个hidden进行隐藏-->
                <textarea name="row[content]" data-rule="required" class="form-control hide" cols="30" rows="5">{$row.content|htmlentities}</textarea>
            </dl>
            <script id="content-tpl" type="text/html">
                <dd class="form-inline">
                    <ins><input type="text" name="<%=name%>[<%=index%>][value]" class="form-control" value="<%=row.value%>" placeholder="内容"/></ins>
                    <ins>
                        <select class="form-control selectpicker" name="<%=name%>[<%=index%>][key]">
                            <% for(let i in data.tpl){  %>
                            <option value="<%= i %>" <%=row.key==i?'selected':'' %> >
                                <%=data.tpl[i]%>
                            </option>
                            <% } %>
                        </select>
                    </ins>
                    <ins><input type="text" name="<%=name%>[<%=index%>][def_val]" class="form-control" value="<%=row.def_val%>" placeholder="默认值"/></ins>
                    <!--下面的两个按钮务必保留-->
                    <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
                    <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
                </dd>
            </script>
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Page')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-page" class="form-control" name="row[page]" type="text" placeholder="/pages/index/index" value="{$row.page|htmlentities}">
                <div class="input-group-btn">
                    <a href="javascript:" class="btn btn-info btn-select-page">选择</a>
                </div>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Ident')}:</label>
        <div class="col-xs-12 col-sm-8">
            <select  id="c-ident" class="form-control selectpicker" name="row[ident]">
                {foreach name="identList" item="vo"}
                    <option value="{$key}" {in name="key" value="$row.ident"}selected{/in}>{$vo}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Switch')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input  id="c-switch" name="row[switch]" type="hidden" value="{$row.switch|htmlentities}">
            <a href="javascript:;" data-toggle="switcher" class="btn-switcher" data-input-id="c-switch" data-yes="1" data-no="0" >
                <i class="fa fa-toggle-on text-success {eq name="$row.switch" value="0"}fa-flip-horizontal text-gray{/eq} fa-2x"></i>
            </a>
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>
